import { isShowWindow } from '@/service/login/login'

const messageSocket = process.env.VUE_APP_BASE_WS
const state = {
  websock: null, // websock变量
  overloadMsg: null, // onmessage 返回的超载数据
  blackMsg: null, // onmessage 返回的黑名单数据
  realtimeMsg: [], // 实时数据
  isShowPopup: false
}

// getters.js
const getters = {
  overloadMsg(state) {
    return state.overloadMsg
  },
  blackMsg(state) {
    return state.blackMsg
  },
  websock(state) {
    return state.websock
  }
}

// mutations 进行数据状态的变化
const mutations = {
  // 申明并连接websocket，
  // 在mutation也能定义websocket的一些方法，但是在vuex严格模式下，异步处理数据浏览器会抛出错误。所以只是申明了websocket
  WEBSOCKET_INIT(state) {
    state.websock = new WebSocket(messageSocket)
  },
  // 将接收到的数据赋值
  WEBSOCKET_REIVE_OVERLOAD(state, data) {
    state.overloadMsg = data
  },
  WEBSOCKET_REIVE_BLACK(state, data) {
    state.blackMsg = data
  },
  WEBSOCKET_REIVE_REALTIME(state, data) {
    state.realtimeMsg = data
  },
  // 关闭连接
  WEBSOCKET_CLOSED(state) {
    state.websock.close()
    state.websock = null
  },
  updateShow(state, data) {
    state.isShowPopup = data
  }
}

// actions 改变状态的操作
const actions = {
  WEBSOCKET_INIT({ commit }, url) {
    // console.log('vuex', state)
    if (state.websock !== null) return
    commit('WEBSOCKET_INIT', url)
    state.websock.onopen = function() {
      // console.log('连接成功！')
    }
    state.websock.οnerrοr = function(e) { // 错误
      console.log('ws错误!')
      console.log(e)
    }
    // websocket与后端链接的数据，为异步链接的方式！
    state.websock.onmessage = function(callBack) {
      // console.log('ws接收', callBack.data)
      // 后端返回的数据，在mutations内进行修改
      if (callBack.data !== '连接成功') {
        const data = JSON.parse(callBack.data)
        // console.log(data)
        if (data.type === 'all') {
          commit('WEBSOCKET_REIVE_BLACK', data)
        } else {
          commit('WEBSOCKET_REIVE_REALTIME', data)
        }
      }
    }
  },
  // 发送消息
  WEBSOCKET_REIVE({ commit }, data) {
    const _msg = JSON.stringify(data)
    state.websock.send(_msg)
  },
  isShowWindow({ commit }) {
    isShowWindow().then(res => {
      // console.log('是否弹窗', res)
      commit('updateShow', res.data)
    })
  }
}
export default {
  namespaced: true,
  state,
  getters,
  actions,
  mutations
}
